<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>车辆在途</title>
    <th:block th:include="statics/common/page/header"></th:block>
</head>
<body>
<div id="rrapp" v-cloak>
	<div v-show="showList">
        <Row class="search-panel-space">
            <div class="search-group">
                <!-- <i-col span="5">
                	<label class="search-label-20">门店:</label>
                    <i-input v-model="q.name" @on-enter="query" placeholder="名称" class="search-item-width-75"/>
                </i-col> -->
                <i-col span="5">
                    <label class="search-label-20">车型:</label>
                    <i-input v-model="q.productName" @on-enter="query" placeholder="名称" class="search-item-width-75"/>
                </i-col>
                <i-col span="5">
                    <label class="search-label-20">填写人:</label>
                    <i-input v-model="q.personName" @on-enter="query" placeholder="名称" class="search-item-width-75"/>
                </i-col>
                <i-col span="5">
                    <label class="search-label-20">车辆VIN:</label>
                    <i-input v-model="q.carVin" @on-enter="query" placeholder="名称" class="search-item-width-75"/>
                </i-col>
                <i-button @click="query">查询</i-button>
                <i-button @click="reloadSearch">重置</i-button>
            </div>
        </Row>
        <Row class="search-panel-space">
            <i-col span="5">
                <label class="search-label-20">在途日期:</label>
                <Date-picker class="search-item-width-75" placeholder="选择日期范围" format="yyyy-MM-dd" placement="bottom-end" @on-change="dateChange" type="daterange" v-model="q.date"></Date-picker>
            </i-col>
            <i-col span="5">
                <label class="search-label-20">发动机号:</label>
                <i-input v-model="q.engine" @on-enter="query" placeholder="名称" class="search-item-width-75"/>
            </i-col>
        </Row>
        <Row :gutter="16">
            <div class="buttons-group">
                <i-button type="info" @click="addLibrary" th:if="${@shiroAuthService.hasPermission('stockroute:route')}">
                    <i class="fa fa-plus"></i>&nbsp;入库</i-button>
                <i-button type="info" @click="add" th:if="${@shiroAuthService.hasPermission('stockroute:save')}">
                	<i class="fa fa-plus"></i>&nbsp;新增</i-button>
                <i-button type="warning" @click="update" th:if="${@shiroAuthService.hasPermission('stockroute:update')}">
                	<i class="fa fa-pencil-square-o"></i>&nbsp;修改</i-button>
                <i-button type="error" @click="del" th:if="${@shiroAuthService.hasPermission('stockroute:delete')}">
                	<i class="fa fa-trash-o"></i>&nbsp;删除</i-button>
                <i-button type="info" @click="showImport" th:if="${@shiroAuthService.hasPermission('stockroute:import')}">
                    <i class="fa fa-plus"></i>&nbsp;导入</i-button>
            </div>
        </Row>
	    <table id="jqGrid"></table>
    </div>

    <Card v-show="showAdd">
        <p slot="title">{{title}}</p>
		<i-form ref="formValidate" :model="stockRoute" :rules="ruleValidate" :label-width="80">
            <Form-item label="车型" prop="productId">
                <i-input v-model="stockRoute.productName" placeholder="车型" icon="eye" readonly="readonly"
                         @on-click="selectProductCar" />
            </Form-item>
            <Form-item label="VIN码" prop="vin">
                <i-input v-model="stockRoute.vin" placeholder="车辆VIN码"/>
            </Form-item>
            <Form-item label="发动机号" prop="engine">
                <i-input v-model="stockRoute.engine" placeholder="发动机号"/>
            </Form-item>
            <Form-item label="厂家指导" prop="guidePrice">
                <i-input v-model="stockRoute.guidePrice" placeholder="厂家指导"/>
            </Form-item>
            <Form-item label="生产日期" prop="productionDate">
            	<Date-picker type="date"  v-model="stockRoute.productionDate" placement="bottom-end" placeholdbottomer="选择日期"></Date-picker>
            </Form-item>
            <Form-item label="选装" prop="optional">
                <i-input v-model="stockRoute.optional" placeholder="选装"/>
            </Form-item>
            <Form-item label="备注" prop="content">
                <i-input v-model="stockRoute.content" placeholder="备注"/>
            </Form-item>
            <Form-item>
                <i-button type="primary" @click="handleSubmit('formValidate')">提交</i-button>
                <i-button type="warning" @click="reload" style="margin-left: 8px"/>返回</i-button>
                <i-button type="ghost" @click="handleReset('formValidate')" style="margin-left: 8px">重置</i-button>
            </Form-item>
        </i-form>
	</Card>

    <Card v-show="routeShow">
        <p slot="title">{{title}}</p>
        <i-form ref="formStorageValidate" :model="stockReal" :rules="ruleStorageValidate" :label-width="80">
            <Form-item label="仓库" prop="storageName">
                <i-input v-model="stockReal.storageName" placeholder="仓库" icon="eye" readonly="readonly"
                         @on-click="selectStorage" required="required"/>
            </Form-item>
            <Form-item id="allowedit">
                <i-button type="warning" @click="delRow" style="margin-left: 8px">删除</i-button>
            </Form-item>
            <Form-item label="入库明细" prop="tableDetail">
                <table id="detailInnerTable" ref="table"></table>
            </Form-item>
            <Form-item>
                <i-button type="primary" @click="submitStockReal('formStorageValidate')">提交</i-button>
                <i-button type="warning" @click="reload" style="margin-left: 8px"/>返回</i-button>
                <i-button type="ghost" @click="handleReset('formStorageValidate')" style="margin-left: 8px">重置</i-button>
            </Form-item>
        </i-form>
    </Card>
    
   	<Modal title="在途导入" v-model="modalImport" class-name="vertical-center-modal" footer-hide="true">
        <i-form>
            <Row>
                <Upload multiple type="drag" action="../stock/route/import" :on-success="impsuccess" :on-error="imperror">
                    <div style="padding: 20px 0">
                        <Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>
                        <p>点击或拖拽文件上传</p>
                    </div>
                </Upload>
            </Row>

            <Form-item>
                <i-button id="success" type="warning" @click="reloadImport" style="float:right;margin-left: 8px;"/>返回</i-button>
                <i-button type="info" @click="downFile" style="float:right;">模板下载</i-button>
            </Form-item>
        </i-form>
    </Modal>
</div>

<script th:src="@{../statics/js/stock/stockroute.js}"></script>
</body>
</html>